<style>
    #peccancyRecord-detail .layui-input-block {
        margin-left: 114px;
    }

    #peccancyRecord-detail .layui-form-label {
        width: 84px;
    }
</style>
<div class="febs-container" id="peccancyRecord-detail">

        <form class="layui-form" action="" lay-filter="peccancyRecord-detail-form">
            <div class="layui-card">
                <blockquote class="layui-elem-quote layui-elem-quote-primary" id="user_field">违章人员信息</blockquote>
                <div class="layui-card-body">
                    <div class="layui-form-item febs-hide">
                        <div class="layui-row">
                            <div class="layui-col-md6">
                                <label class="layui-form-label febs-form-item-require">id：</label>
                                <div class="layui-input-block">
                                    <input type="text" name="informationId" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label febs-form-item-require">公司Id：</label>
                                <div class="layui-input-block">
                                    <input type="text" name="tenantId" autocomplete="off" class="layui-input"
                                           maxlength="32">
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章对象：</label>
                            <div th:switch="${peccancyInformation.peccancyObject}">
                                <div th:case="1" class="layui-input-block layui-input-block-html">本工</div>
                                <div th:case="2" class="layui-input-block layui-input-block-html">外包</div>
                                <div th:case="3" class="layui-input-block layui-input-block-html">外协</div>
                                <div th:case="4" class="layui-input-block layui-input-block-html">承包队</div>
                                <div th:case="5" class="layui-input-block layui-input-block-html">部门</div>
                            </div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">对象名称：</label>
                            <div th:switch="${peccancyInformation.peccancyObject}">
                                <div th:case="1" class="layui-input-block layui-input-block-html" data-th-text="${peccancyInformation.peccancyRealName}"></div>
                                <div th:case="2" class="layui-input-block layui-input-block-html" data-th-text="${peccancyInformation.peccancyRealName}"></div>
                                <div th:case="3" class="layui-input-block layui-input-block-html" data-th-text="${peccancyInformation.peccancyRealName}"></div>
                                <div th:case="4" class="layui-input-block layui-input-block-html" data-th-text="${peccancyInformation.peccancyUserContractorTeamName}"></div>
                                <div th:case="5" class="layui-input-block layui-input-block-html" data-th-text="${peccancyInformation.peccancyUserDept}"></div>
                            </div>
                        </div>
                    </div>
                    <div th:if="${peccancyInformation.peccancyObject < '4'}">
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">身份证号：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserIdentificationNo}"></div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">人员工号：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserNo}"></div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">所属部门：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserDept}"></div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">岗位名称：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserPostName}"></div>
                            </div>
                        </div>
                    </div>

                    <div th:if="${peccancyInformation.peccancyObject eq '2'}">
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">所属承包方：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserContractorName}"></div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">所属承包队：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserContractorTeamName}"></div>
                            </div>
                        </div>
                    </div>
                    <div th:if="${peccancyInformation.peccancyObject eq '4'}">
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">所属承包方：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserContractorName}"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-card">
                <blockquote class="layui-elem-quote layui-elem-quote-primary" id="project_field">违章项目信息</blockquote>
                <div class="layui-card-body">
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章单号：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyNo}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">所属公司：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.tenantName}"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">所属业务：</label>
                            <div th:switch="${peccancyInformation.businessType}">
                                <div th:case="1" class="layui-input-block layui-input-block-html">海工</div>
                                <div th:case="2" class="layui-input-block layui-input-block-html">修船</div>
                                <div th:case="3" class="layui-input-block layui-input-block-html">造船</div>
                                <div th:case="4" class="layui-input-block layui-input-block-html">场地</div>
                            </div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">项目名称：</label>
                            <div class="layui-input-block layui-input-block-html"th:text="${peccancyInformation.projectName}" >

                            </div>
                        </div>
                        <!--                        <div class="layui-col-md6">-->
                        <!--                            <label class="layui-form-label layui-form-label-detail">违章地点：</label>-->
                        <!--                            <div class="layui-input-block" th:text="${peccancyInformation.peccancyAxis}"></div>-->
                        <!--                        </div>-->
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章区域：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyArea}"></div>
                        </div>

                    </div>
                </div>
            </div>

            <div class="layui-card">
                <blockquote class="layui-elem-quote layui-elem-quote-primary" id="peccancy_field">违章信息</blockquote>
                <div class="layui-card-body">

                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章类型：</label>
                            <div class="layui-input-block layui-input-block-html" id="peccancyType" ></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">作业类别：</label>
                            <div class="layui-input-block layui-input-block-html" id="jobOperation" ></div>
                        </div>

                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章原因：</label>
                            <div class="layui-input-block layui-input-block-html" id="peccancyRootCause" ></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章性质：</label>
                            <div th:switch="${peccancyInformation.peccancyNature}">
                                <div th:case="1" class="layui-input-block layui-input-block-html">一般</div>
                                <div th:case="2" class="layui-input-block layui-input-block-html">较重</div>
                                <div th:case="3" class="layui-input-block layui-input-block-html">严重</div>
                            </div>
                        </div>
                    </div> ,  jnjmnjnnn

                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章时间：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyTime}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">是否现场：</label>
                            <div th:switch="${peccancyInformation.isScene}">
                                <div th:case="1" class="layui-input-block layui-input-block-html">是</div>
                                <div th:case="0" class="layui-input-block layui-input-block-html">否</div>
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">

                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">条款类型：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.clauseName}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">处理形式：</label>
                            <div class="layui-input-block layui-input-block-html" id="disposeForm"></div>
                        </div>
                    </div>


                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">惩罚原因：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.reason}"></div>
                        </div>

                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md12">
                            <label class="layui-form-label layui-form-label-detail">照片：</label>
                            <div class="layui-input-block layui-input-block-html">
                                <div id="fileUpload" style="height: 120px ;width: 100%">
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章人签名：</label>
                            <div class="layui-input-block layui-input-block-html" >
                                <img id="peccancyUserSignImg" alt="" data-th-src="'/'+${peccancyInformation.peccancyUserSign}"
                                     th:if="${peccancyInformation.peccancyUserSign}"
                                     style="width: 120px ;height: 50px"/>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">开单人：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.invoiceRealName}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">开单时间：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.invoiceDate}"></div>
                        </div>

                    </div>
                </div>
            </div>

            <div th:if="${peccancyInformation.auditList} and ${peccancyInformation.auditList.size() > 0}">
                <div class="layui-card">
                    <blockquote class="layui-elem-quote layui-elem-quote-primary" >审核记录</blockquote>
                    <div class="layui-card-body">
                        <div class="layui-form-item">
                            <table lay-filter="peccancyAuditRecordTable" id="peccancyAuditRecordTable" lay-data="{id: 'peccancyAuditRecordTable'}"></table>
                        </div>
                    </div>
                </div>
            </div>

            <div th:if="${peccancyInformation.appeaFlg eq '1'}">
                <div class="layui-card">
                    <blockquote class="layui-elem-quote layui-elem-quote-primary" id="appeal_field">申诉信息</blockquote>
                    <div class="layui-card-body">
                        <div class="layui-form-item">
                            <div class="layui-col-md12">
                                <label class="layui-form-label layui-form-label-detail">申诉信息：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.appealReason}"></div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">申诉人：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.appealRealName}"></div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">申诉时间：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.appealTime}"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div th:if="${peccancyInformation.issuanceList} and ${peccancyInformation.issuanceList.size() > 0}">
                <div class="layui-card">
                    <blockquote class="layui-elem-quote layui-elem-quote-primary" >签发记录</blockquote>
                    <div class="layui-card-body">
                        <div class="layui-form-item">
                            <table lay-filter="peccancyIssuanceRecordTable" id="peccancyIssuanceRecordTable" lay-data="{id: 'peccancyIssuanceRecordTable'}"></table>
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-form-item febs-hide">
                <button class="layui-btn" lay-submit="" lay-filter="peccancyRecord-detail-form-submit"
                        id="submit"></button>
                <button type="reset" class="layui-btn" id="reset"></button>
            </div>
        </form>
</div>
<script data-th-inline="javascript">
    var peccancyInformation = [[${peccancyInformation}]];
</script>
<script>
    layui.use(['jquery','febs', 'form', 'validate', 'fileUpload', 'fileUpload','autocomplete','commonJS', 'table','fileUpload'], function () {
        var $ = layui.$,
            febs = layui.febs,
            form = layui.form,
            table = layui.table,
            fileUpload = layui.fileUpload,
            $view = $('#peccancyRecord-detail'),
            validate = layui.validate,
            auditTableIns,
           issuanceTableIns;
        form.verify(validate);
        form.render();
        initFormValue();
        initDetailTale();

        var fileUploadDiv = fileUpload.render({
            elem: '#fileUpload',
            url: ctx + 'hazard/upload',
            type: 0,//0-图片，1-视频，2-其他
            maxNum:5,
            defaultData: peccancyInformation && peccancyInformation.fileList ? peccancyInformation.fileList:[],
            isDetail: true,
            done: function (res) {
            },
        });


        function initDetailTale(){
            if(peccancyInformation.auditList){
                auditTableIns = febs.table.init({
                    elem: $view.find('table[id="peccancyAuditRecordTable"]'),
                    id: 'peccancyAuditRecordTable',
                    page:false,
                    skin: '',
                    limit:Number.MAX_VALUE,
                    cols: [
                        [
                        {type: 'numbers',title:'序号'},
                        {field: 'auditRealName', title: '审核人姓名', minWidth: 80},
                        {
                            field: 'auditResult', title: '审核结果', width: 100, align: 'center', templet: function (d) {
                                if (d.auditResult == '1') {
                                    return '<span class="layui-badge febs-tag-green">审核通过</span>';
                                } else {
                                    return '<span class="layui-badge febs-tag-magenta">审核退回</span>';
                                }
                            }
                        },
                        {field: 'auditTime', title: '审核时间', width: 160,align:'center'},
                        {field: 'auditReason', title: '审核理由', minWidth: 120 }
                    ]
                    ],
                    data:peccancyInformation.auditList
                });
            }

            if(peccancyInformation.issuanceList){
                issuanceTableIns = febs.table.init({
                    elem: $view.find('table[id="peccancyIssuanceRecordTable"]'),
                    id: 'peccancyIssuanceRecordTable',
                    page:false,
                    skin: '',
                    limit:Number.MAX_VALUE,
                    cols: [
                        [
                        {type: 'numbers',title:'序号'},
                        {field: 'auditRealName', title: '签发人姓名', minWidth: 80},
                        {
                            field: 'auditResult', title: '签发结果', width: 100, align: 'center', templet: function (d) {
                                if (d.auditResult == '1') {
                                    return '<span class="layui-badge febs-tag-green">签发通过</span>';
                                } else {
                                    return '<span class="layui-badge febs-tag-magenta">签发退回</span>';
                                }
                            }
                        },
                        {field: 'auditTime', title: '签发时间', width: 160,align:'center'},
                        {field: 'auditReason', title: '签发理由', minWidth: 120 },
                    ]
                    ],
                    data:peccancyInformation.issuanceList
                });
            }
            form.render()
        }




        function initFormValue() {
            if(peccancyInformation.peccancyType){
                febs.initDictItemLabel($view.find('#peccancyType'),'SAFETY_PECCANCY_TYPE',peccancyInformation.peccancyType)
            }
            if(peccancyInformation.peccancyRootCause){
                febs.initDictItemLabel($view.find('#peccancyRootCause'),'SAFETY_PECCANCY_ROOT_REASON',peccancyInformation.peccancyRootCause)
            }
            if(peccancyInformation.jobOperation){
                febs.initDictItemLabel($view.find('#jobOperation'),'SAFETY_JOB_OPERATION',peccancyInformation.jobOperation)
            }
            if(peccancyInformation.disposeForm){
                febs.initDictItemLabel($view.find('#disposeForm'),'SAFETY_PECCANCY_DISPOSE_FORM',peccancyInformation.disposeForm)
            }
        }


    });

</script>